@import "../../var";
@import "../../mixin";
.gzl-title {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #fff;
  .gzl-title__info {
    position: relative;
    &:before,
    &:after {
      content: '';
      position: absolute;
      top: 0;
      bottom: 0;
      margin: auto;
      width: px(3);
      height: px(3);
      background-image: linear-gradient(-90deg, #FFFFFF 0%, #333333 0%);
      transform: rotate(45deg);
    }
    &:before {
      right: 100%;
    }
    &:after {
      left: 100%;
    }
  }
  strong {
    position: relative;
    display: inline-block;
    padding: 0 px(17);
    font-size: px(16);
    &:before,
    &:after {
      content: '';
      position: absolute;
      top: 0;
      bottom: 0;
      margin: auto;
      width: px(44);
      height: 1px;
      background: linear-gradient(-90deg, #FFFFFF 0%, #333333 0%);
      transform: scaleY(.5);
    }
    &:before {
      right: 100%;
      margin-right: px(7);
    }
    &:after {
      left: 100%;
      margin-left: px(7);
    }
  }
}
.gzl-cell__title {
  color: $clr-g9;
  font-size: px(12);
  @include calc(padding,12,16,4);
}
.gzl-cell {
  position: relative;
  display: flex;
  @include calc(padding,12,16);
  background: #fff;
  align-items: center;
  &:after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    left: px(16);
    border-top: 1px solid $clr-ge;
    transform: scaleY(.5);
  }
  &:last-child:after {
    opacity: 0;
  }
  &.error {
    &:after {
      opacity: 1;
      border-top: 1px solid $clr-warn;
    }
    ::-webkit-input-placeholder {color: $clr-warn;}
    :-moz-placeholder {color: $clr-warn;}
    ::-moz-placeholder {color: $clr-warn;}
    :-ms-input-placeholder {color: $clr-warn;}
    .placeholder {color: $clr-warn !important;}
  }
  .gzl-cell__tip {
    color: $clr-g9;
    font-size: px(12);
    margin-left: px(4);
  }
}
.gzl-cell__hd {}
.gzl-cell__bd {
  flex: 1;
}
.gzl-cell__ft {
  color: $clr-g9;
}
// 箭头
.gzl-cell_access {
  .gzl-cell__ft {
    padding-right: px(15);
    position: relative;
    &:after{
      content: " ";
      display: inline-block;
      height: px(8);
      width: px(8);
      @include calc(border-width,1,1,0,0);
      border-color: #979797;
      border-style: solid;
      transform: matrix(.71,.71,-.71,.71,0,0);
      position: absolute;
      top: 50%;
      right: px(2);
      margin-top: px(-4);
    }
  }
}
// 展开
.gzl-cells {
  &:first-child {
    .gzl-cell_spreadcon {
      display: block;
    }
  }
  &:not(:last-child) {
    .gzl-cell_spread {
      &:after {
        content: '';
        position: absolute;
        bottom: 0;
        right: 0;
        left: px(16);
        border-bottom: 1px solid $clr-ge;
        transform: scaleY(.5);
      }
    }
  }
}
.gzl-cell_spread {
  position: relative;
  &.show {
    &:after {
      display: none;
    }
    .gzl-cell__ft {
      &:after {
        @include calc(border-width,1,0,0,1);
        margin-top: 0;
      }
    }
  }
  .gzl-cell__ft {
    padding-right: px(20);
    position: relative;
    &:after{
      content: " ";
      display: inline-block;
      height: px(8);
      width: px(8);
      @include calc(border-width,0,1,1,0);
      border-color: #979797;
      border-style: solid;
      transform: matrix(.71,.71,-.71,.71,0,0);
      position: absolute;
      top: 50%;
      right: px(2);
      margin-top: px(-6);
    }
  }
  +.gzl-cell_spreadcon {
    display: none;
  }
}

.gzl-headTips{
  padding: px(10) px(16);
  background-color: #FBF596;
  color: #333333;
  position: relative;
  transition: all 0.3s linear;
  em{
    color: #0e81ff;
    font-style: normal;
    margin-right: px(4);
  }
  &.fontsize12{
    font-size: 0.12rem;
    line-height: 0.18rem;
  }
  .closePadding6{
    padding: px(6);
  }
}